<template>
  <j-modal :title="title" width="800px" :visible.sync="visible" :okClose="false" @ok="handleOk">
    <a-spin :spinning="loading">
      <a-form-model v-bind="layout" ref="formModal" :model="form" :rules="rules">
        <a-form-model-item label="平台" prop="fileType">
          <a-radio-group v-model="form.fileType" @change="fileTypeChange">
            <a-radio value="1">微信</a-radio>
            <a-radio value="2">微博</a-radio>
            <a-radio value="3">头条</a-radio>
            <a-radio value="4">抖音</a-radio>
            <a-radio value="5">西瓜</a-radio>
          </a-radio-group>
        </a-form-model-item>
        <template v-if="form.fileType == '1'">
          <a-form-model-item label="账号AppKey" prop="fileName">
            <a-input v-model="form.fileName"></a-input>
          </a-form-model-item>
          <a-form-model-item label="账号AppSecret" prop="fileName">
            <a-input v-model="form.fileName"></a-input>
          </a-form-model-item>
        </template>
      </a-form-model>
    </a-spin>
  </j-modal>
</template>

<script>
import { postAction } from '@/api/manage'
import { isAudioFile, isImgFile, isVideoFile } from '../../../utils/xinkeUtil'
import { getAction } from '../../../api/manage'
import UploadWithMediaType from '../../../components/xinke/UploadWithMediaType'
import VideoUpload from '../../../components/xinke/VideoUpload'

export default {
  name: 'AddModal',
  components: { UploadWithMediaType, VideoUpload },
  data() {
    return {
      title: '新增',
      loading: false,
      visible: false,
      layout: {
        labelCol: { md: 7, lg: 6 },
        wrapperCol: { md: 17, lg: 18 }
      },
      form: {
        fileType: '1',
        showRange: null,
        tagList: []
      },
      rules: {
        fileType: [{ required: true, message: '请选择文件类型' }],
        fileList: [{ required: true, message: '请上传文件并等文件上传完毕' }],
        fileName: [{ required: true, message: '请输入文件夹名称' }],
        showRange: [{ required: true, message: '请选择可见范围' }]
      },
      libParentList: [],
      groupList: [],
      customGroup: false,
      tagList: [],
      bigFileInfo: null
    }
  },
  methods: {
    async loadAllGroup() {
      const groupResult = await getAction('filebank/api/queryAllGroup')
      this.groupList = groupResult.result
    },
    async loadAllTag() {
      const tagList = await getAction('filebank/api/queryAllTag')
      this.tagList = tagList.result
    },
    //从已有标签中选择
    addTagList(tagName) {
      if (!this.form.tagList) {
        this.form.tagList = []
      }
      const item = this.form.tagList.find(item => item == tagName)
      if (!item) {
        this.form.tagList.push(tagName)
      }
    },
    show(parentId, showRange) {
      this.title = '新增'
      this.form = {
        fileType: '1',
        parentId,
        showRange,
        tagList: []
      }
      this.visible = true
      this.loadAllGroup()
      this.loadAllTag()
    },
    fileTypeChange() {
      this.$refs.formModal.clearValidate()
    },
    handleOk() {
      this.$refs.formModal.validate(validate => {
        if (validate) {
          this.loading = true
          if (this.form.fileList && this.form.fileList.length > 0) {
            if (!this.customGroup && this.form.group) {
              this.form.groupName = this.form.group.key
            }
          }
          this.form.sizeType = 1
          if (this.form.fileType == 3) {
            if (this.bigFileInfo == null) {
              this.$message.error('请先上传视频');
              this.loading = false;
              return false;
            }
            this.form.sizeType = 2
            this.form.guid = this.bigFileInfo.uuid
            this.form.fileName = this.bigFileInfo.filename
            this.form.fileSuffix = this.bigFileInfo.filename.split('.')[1]
          }
          postAction('filebank/api/add', this.form)
            .then(res => {
              if (res.success) {
                this.visible = false
                this.$emit('refresh')
              } else {
                this.$message.error(res.message)
              }
            })
            .finally(() => {
              this.loading = false
            })
        } else {
          return false
        }
      })
    },
    fileUploaded(e) {
      this.bigFileInfo = e
    }
  }
}
</script>

<style scoped></style>
